<template>
  <div class="container">
    <div class="table-container">
      <el-table
          :data="tableData"
          border
          style="width: 100%">
        <el-table-column prop="brand" label="商标" width="112">
          <template slot-scope="scope">
            <img :src="scope.row.brand" width="100" height="100" class="cover"/>
          </template>
        </el-table-column>
        <el-table-column
            prop="name"
            label="公司名称"
            width="120">
        </el-table-column>
        <el-table-column
            prop="size"
            label="公司规模"
            width="120">
        </el-table-column>
        <el-table-column prop="license" label="营业执照" width="150">
          <template slot-scope="scope">
            <img :src="scope.row.license" width="120" height="100" class="cover"/>
          </template>
        </el-table-column>
        <el-table-column
            prop="description"
            label="公司描述"
            width=800>
        </el-table-column>
      </el-table>
    </div>
    <div class="pagination-container">
      <el-pagination
          background
          layout="prev, pager, next"
          :total="totalPages"
          :page-size="pageSize"
          :current-page="currentPage"
          @current-change="handlePageChange"
          style="height: 83px"
      ></el-pagination>
    </div>
  </div>
</template>


<script>
import axios from "axios";

export default {
  data() {
    return {
      generatedAccount: '', // 用于存储生成的账号
      generatedPassword: '', // 用于存储生成的账号密码
      companyEamil: '',
      companyId: '',
      dialogVisible: false,
      tableData: [],
      currentPage: 1,
      pageSize: 4,
      totalPages: 100
    }
  },
  methods: {
    fetchTableData() {
      axios.get('/api/company/getAudited').then(resp => {
        console.log(resp.data);
        const allData = resp.data;
        console.log(allData.length)
        this.totalPages = 7;
        const startIndex = (this.currentPage - 1) * this.pageSize;
        const endIndex = startIndex + this.pageSize;
        this.tableData = allData.slice(startIndex, endIndex);
      }).catch(error => {
        console.error("获取公司数据出错：", error);
      });
    },
    handlePageChange(page) {
      this.currentPage = page;
      this.fetchTableData();
    },
  },
  mounted() {
    this.fetchTableData();
  }
}
</script>

<style scoped>
.container {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.table-container {
  flex: 1;
  overflow: auto;
}

.pagination-container {
  display: flex;
  justify-content: flex-start;
  margin-top: 10px;
}
</style>
